<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>登录页面</title>
    <meta name="keywords" content="user,login"/>
    <meta name="description" content="用户登录,登录"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>

    <!-- basic styles -->

    <link href="/webpage/assets/css/bootstrap.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="/webpage/assets/css/font-awesome.min.css"/>

    <!--[if IE 7]>
    <link rel="stylesheet" href="/webpage/assets/css/font-awesome-ie7.min.css"/>
    <![endif]-->

    <!-- page specific plugin styles -->

    <!-- fonts -->

    <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:400,300"/>

    <!-- ace styles -->

    <link rel="stylesheet" href="/webpage/assets/css/ace.min.css"/>
    <link rel="stylesheet" href="/webpage/assets/css/ace-rtl.min.css"/>
    <link rel="stylesheet" href="/webpage/assets/css/ace-skins.min.css"/>

    <script src="/webpage/assets/js/ace-extra.min.js"></script>
    <script src="/webpage/script/security.js"></script>

    <!--[if lte IE 8]>
    <link rel="stylesheet" href="/webpage/assets/css/ace-ie.min.css"/>
    <![endif]-->

    <!-- inline styles related to this page -->

    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->

    <script type="text/javascript" src="/webpage/script/ie.js"></script>

    <!--[if lt IE 9]>
    <script src="/webpage/assets/js/html5shiv.js"></script>
    <script src="/webpage/assets/js/respond.min.js"></script>
    <![endif]-->

    <script>
        function login() {
            $.ajax({
                url: "/user/public/rsaKeySalt",
                type: "GET",
                dataType: "json",
                beforeSend: function (request) {
                    request.setRequestHeader("Authorization", localStorage.token);
                },
                success: function (data) {
                    if (data.success) {
                        //通过模和公钥参数获取公钥
                        var rsakey = new RSAUtils.getKeyPair(data.data.exponentHex, "", data.data.modulusHex);
                        loginTo(rsakey, data.data.salt);
                    }
                },
                error: function () {
                }
            });
        }

        function loginTo(rsakey, salt) {
            $(this).overlay({
                closeOnClick: true
            });

            var data = {};
            data.account = $("#username").val();
            data.password = salt + "-" + $("#password").val();

            //反转密码的顺序
            var reversedPwd = data.password.split("").reverse().join("");
            //对密码进行加密传输
            data.password = RSAUtils.encryptedString(rsakey, reversedPwd);

            $.ajax({
                cache: true,
                type: "POST",
                url: '/user/admin/adminLogin',
                data: data,
                dataType: 'json',
                success: function (rs) {
                    if (rs.success) {
                        $("#password").val("");
                        // 本地存储Token
                        var token = rs.data;
                        sessionStorage.setItem('token',token);
//                        alert(token);
                        window.location.href = "/webpage/index.html";
                    } else {
                        $("#tipsModal").find(' .modal-body > p').text(rs.message);
                        $("#tipsModal").modal();
                        $(".overlay").remove();
                    }
                },
                error: function (request) {
                    alert(request);
                    $(".overlay").remove();
                }
            });
        }
    </script>
</head>

<body class="login-layout bgimg">
<div class="main-container ">
    <div class="main-contentnews">
        <div class="row">
            <div class="col-sm-10 col-sm-offset-1">
                <div class="login-container">
                    <div class="center">
                        <h1>

                            <span class="red">Coolface管理系统</span>
                            <span class="white"></span>
                        </h1>
                        <!-- <h4 class="blue">&copy; Company Name</h4> -->
                    </div>

                    <div class="space-6"></div>

                    <div class="position-relative">
                        <div id="login-box" class="login-box visible widget-boxs no-border">
                            <div class="widget-body widget-body2">
                                <div class="widget-main">
                                    <h4 class="header header2 blue2 lighter bigger" style="text-align: center;">
                                        <!-- <i class="icon-coffee green"></i> -->
                                        用户登录
                                    </h4>

                                    <div class="space-6"></div>

                                    <form id="loginPageFormId">
                                        <fieldset>
                                            <label class="block clearfix">
														<span class="block input-icon input-icon-right color">
                                                            用户名
															<input id="username" name="name" type="text"
                                                                   class="form-control form-control2"
                                                                   placeholder="Username"/>
                                                            <!-- <i class="icon-user"></i> -->
														</span>
                                            </label>

                                            <label class="block clearfix">
														<span class="block input-icon input-icon-right color">
														    密码
															<input id="password" name="password" type="password"
                                                                   class="form-control" placeholder="Password"/>
                                                            <!-- <i class="icon-lock"></i> -->
														</span>
                                            </label>

                                            <!--
                                            <label class="block clearfix">
                                                <span class="block input-icon input-icon-right">
                                                    验证码
                                                    <div style="width:100%;">
                                                    <input type="password" class="form-control"  style="width:46%;display:inline;" placeholder="validCode" />
                                                    <input type="password" class="form-control"  style="width:46%;display:inline;" placeholder="Password" />
                                                    <img src="/i/eg_tulip.jpg"  alt="上海鲜花港 - 郁金香" />
                                                    </div>
                                                </span>
                                            </label>
                                            -->

                                            <div class="space"></div>

                                            <div class="clearfix">
                                                <!-- <label class="inline">
                                                    <input type="checkbox" class="ace" />
                                                    <span class="lbl"> Remember Me</span>
                                                </label> -->

                                                <button type="button" onclick="login();"
                                                        ōnkeydown="return disableEnter(event)"
                                                        class="width-35 pull-right btn btn-sm btn-primary">
                                                    <i class="icon-key"></i>
                                                    登录
                                                </button>
                                            </div>

                                            <div class="space-4"></div>
                                        </fieldset>
                                    </form>

                                    <!-- <div class="social-or-login center">
                                        <span class="bigger-110">Or Login Using</span>
                                    </div>

                                    <div class="social-login center">
                                        <a class="btn btn-primary">
                                            <i class="icon-facebook"></i>
                                        </a>

                                        <a class="btn btn-info">
                                            <i class="icon-twitter"></i>
                                        </a>

                                        <a class="btn btn-danger">
                                            <i class="icon-google-plus"></i>
                                        </a>
                                    </div> -->
                                </div><!-- /widget-main -->

                                <div class="toolbars clearfix">
                                    <!-- <div>
                                        <a href="#" onclick="show_box('forgot-box'); return false;" class="forgot-password-link">
                                            <i class="icon-arrow-left"></i>
                                            I forgot my password
                                        </a>
                                    </div>

                                    <div>
                                        <a href="#" onclick="show_box('signup-box'); return false;" class="user-signup-link">
                                            I want to register
                                            <i class="icon-arrow-right"></i>
                                        </a>
                                    </div> -->
                                </div>
                            </div><!-- /widget-body -->
                        </div><!-- /login-box -->

                        <div id="forgot-box" class="forgot-box widget-box no-border">
                            <div class="widget-body">
                                <div class="widget-main">
                                    <h4 class="header red lighter bigger">
                                        <i class="icon-key"></i>
                                        Retrieve Password
                                    </h4>

                                    <div class="space-6"></div>
                                    <p>
                                        Enter your email and to receive instructions
                                    </p>

                                    <form>
                                        <fieldset>
                                            <label class="block clearfix">
														<span class="block input-icon input-icon-right">
															<input type="email" class="form-control"
                                                                   placeholder="Email"/>
															<i class="icon-envelope"></i>
														</span>
                                            </label>

                                            <div class="clearfix">
                                                <button type="button" class="width-35 pull-right btn btn-sm btn-danger">
                                                    <i class="icon-lightbulb"></i>
                                                    Send Me!
                                                </button>
                                            </div>
                                        </fieldset>
                                    </form>
                                </div><!-- /widget-main -->

                                <div class="toolbar center">
                                    <a href="#" onclick="show_box('login-box'); return false;"
                                       class="back-to-login-link">
                                        Back to login
                                        <i class="icon-arrow-right"></i>
                                    </a>
                                </div>
                            </div><!-- /widget-body -->
                        </div><!-- /forgot-box -->

                        <div id="signup-box" class="signup-box widget-box no-border">
                            <div class="widget-body">
                                <div class="widget-main">
                                    <h4 class="header green lighter bigger">
                                        <i class="icon-group blue"></i>
                                        New User Registration
                                    </h4>

                                    <div class="space-6"></div>
                                    <p> Enter your details to begin: </p>

                                    <form>
                                        <fieldset>
                                            <label class="block clearfix">
														<span class="block input-icon input-icon-right">
															<input type="email" class="form-control"
                                                                   placeholder="Email"/>
															<i class="icon-envelope"></i>
														</span>
                                            </label>

                                            <label class="block clearfix">
														<span class="block input-icon input-icon-right">
															<input type="text" class="form-control"
                                                                   placeholder="Username"/>
															<i class="icon-user"></i>
														</span>
                                            </label>

                                            <label class="block clearfix">
														<span class="block input-icon input-icon-right">
															<input type="password" class="form-control"
                                                                   placeholder="Password"/>
															<i class="icon-lock"></i>
														</span>
                                            </label>

                                            <label class="block clearfix">
														<span class="block input-icon input-icon-right">
															<input type="password" class="form-control"
                                                                   placeholder="Repeat password"/>
															<i class="icon-retweet"></i>
														</span>
                                            </label>

                                            <label class="block">
                                                <input type="checkbox" class="ace"/>
                                                <span class="lbl">
															I accept the
															<a href="#">User Agreement</a>
														</span>
                                            </label>

                                            <div class="space-24"></div>

                                            <div class="clearfix">
                                                <button type="reset" class="width-30 pull-left btn btn-sm">
                                                    <i class="icon-refresh"></i>
                                                    Reset
                                                </button>

                                                <button type="button"
                                                        class="width-65 pull-right btn btn-sm btn-success">
                                                    Register
                                                    <i class="icon-arrow-right icon-on-right"></i>
                                                </button>
                                            </div>
                                        </fieldset>
                                    </form>
                                </div>

                                <div class="toolbar center">
                                    <a href="#" onclick="show_box('login-box'); return false;"
                                       class="back-to-login-link">
                                        <i class="icon-arrow-left"></i>
                                        Back to login
                                    </a>
                                </div>
                            </div><!-- /widget-body -->
                        </div><!-- /signup-box -->
                    </div><!-- /position-relative -->
                </div>
            </div><!-- /.col -->
        </div><!-- /.row -->
    </div>
</div><!-- /.main-container -->

<!-- 模态框提示信息 start -->
<div class="modal fade" id="tipsModal" tabindex="-1">
    <div class="modal-dialog"><!-- 模块会话 -->
        <div class="modal-content">
            <div class="modal-header" style="background-color: #5bc0de;color: #fff;">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true"> ×</span>
                </button>
                <h4 class="modal-title" id="myModalLabel">提示消息</h4>
            </div>
            <div class="modal-body">
                <p>内容主体</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary" data-dismiss="modal">确认</button>
            </div>
        </div><!-- /.model-content -->
    </div><!-- /.model-dialog -->
</div><!-- /.modal -->
<!-- 模态框提示信息 start -->

<!-- basic scripts -->

<!--[if !IE]> -->

<script src="/webpage/assets/js/jquery-2.0.3.min.js"></script>
<script src="/webpage/assets/js/bootstrap.min.js"></script>
<!-- <![endif]-->

<!--[if IE]>
<script src="/webpage/assets/js/jquery-1.10.2.min.js"></script>
<![endif]-->

<!--[if !IE]> -->

<script type="text/javascript">
    window.jQuery || document.write("<script src='/webpage/assets/js/jquery-2.0.3.min.js'>" + "<" + "/script>");
</script>

<!-- <![endif]-->

<!--[if IE]>
<script type="text/javascript">
    window.jQuery || document.write("<script src='/webpage/assets/js/jquery-1.10.2.min.js'>" + "<" + "/script>");
</script>
<![endif]-->

<script type="text/javascript">
    if ("ontouchend" in document) document.write("<script src='/webpage/assets/js/jquery.mobile.custom.min.js'>" + "<" + "/script>");
</script>

<script src="/webpage/assets/js/jquery.overlay.min.js"></script>

<!-- inline scripts related to this page -->

<script type="text/javascript">
    function show_box(id) {
        jQuery('.widget-box.visible').removeClass('visible');
        jQuery('#' + id).addClass('visible');
    }
</script>

<script>

    $(function () {
        $(document).keypress(function (e) {
            if (e.keyCode == 13)
                login();
        })
    });
</script>
<!-- <div style="display:none"> -->
</div>
</body>
</html>
